<!-- 测点管理 -->
<template>
    <div>
        <div class="tab">
            <el-tabs v-model="activeName" @tab-click="handleClick">
                <el-tab-pane
                    v-for="item in mallList"
                    :key="item.name"
                    :label="item.label"
                    :name="item.name"
                />
            </el-tabs>
            <ConsumptionEnergy :mall-type="activeName" />
        </div>
    </div>
</template>

<script>
    import ConsumptionEnergy from './consumptionEnergy/index.vue'

    export default {
        components: {
            ConsumptionEnergy,
        },
        data() {
            return {
                activeName: 'jordanMall',
                mallList: [
                    { label: '佐敦荟商场', name: 'jordanMall' },
                    { label: '乐声大厦', name: 'lokSang' },
                    { label: '旺角新之城', name: 'mongkokCity' },
                    { label: '青衣灏景湾', name: 'tsingYi' },
                    { label: '大埔墟幸汇', name: 'taiPo' },
                ],
            }
        },
        methods: {
            handleClick() {
                // 如果需要在切换标签时执行一些操作可以在这里添加
            },
        },
    }
</script>
<style lang="scss" scoped>
    ::v-deep .el-tabs__nav-wrap::after {
        background-color: rgba(255, 255, 255, 0.1) !important;
    }
</style>
